package com.example.app.pages.main.home.addNew.addRecord.MyModalBottomSheetRelationPicker

import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.WindowInsets
import androidx.compose.foundation.layout.fillMaxHeight
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.offset
import androidx.compose.foundation.layout.width
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.rounded.ManageAccounts
import androidx.compose.material3.ButtonColors
import androidx.compose.material3.ButtonDefaults
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.ListItemDefaults
import androidx.compose.material3.MaterialTheme
import androidx.compose.runtime.Composable
import androidx.compose.runtime.collectAsState
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.rememberCoroutineScope
import androidx.compose.runtime.setValue
import androidx.compose.ui.Modifier
import androidx.compose.ui.platform.LocalConfiguration
import androidx.compose.ui.platform.LocalContext
import androidx.compose.ui.platform.LocalDensity
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.text.input.TextFieldValue
import androidx.compose.ui.unit.Dp
import androidx.compose.ui.unit.dp
import com.example.app.addNewViewModel
import com.example.app.components.MyButton.MyFilledTonalButton
import com.example.app.components.MyDialog.MyfullScreenDialogState
import com.example.app.components.MyDivider.MyDivider
import com.example.app.components.MyDivider.MyDividerDirection
import com.example.app.components.MyIcon.MyIcon
import com.example.app.components.MyIcon.MyNavigationIcon
import com.example.app.components.MyListItem.MyListItem
import com.example.app.components.MyNotify.MyNotify
import com.example.app.components.MyNotify.MyNotifyType
import com.example.app.components.MyScaffold.MyCustomScaffold
import com.example.app.components.MySpacer.MySpacer
import com.example.app.components.MyText.MyText
import com.example.app.components.MyTextField.MyTextField
import com.example.app.components.MyTextField.MyTextFieldState
import com.example.app.components.MyTopBar.MyTopBar
import com.example.app.pages.main.home.me.viewModel.AddNewViewModel
import com.example.app.ui.theme.smallSpacer
import com.example.app.viewmodel.MainViewModel
import kotlinx.coroutines.launch

var addRelationTextFieldState = MyTextFieldState()
//新增关系
@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun AddRelation(

        animateOffsetX: Dp,
        fullScreenDialogState: MyfullScreenDialogState,

        dismiss: () -> Unit
) {
    var notifyShow = remember {
        mutableStateOf(false)
    }
    var notifyType = remember {
        mutableStateOf(MyNotifyType.SUCCESS)
    }
    var notifyContent = remember {
        mutableStateOf("")
    }
    var context = LocalContext.current
    var windowWidth = with(LocalDensity.current) {
        LocalConfiguration.current.screenWidthDp
    }.dp
    MyCustomScaffold(
        modifier = Modifier
            .offset(x = animateOffsetX)
            .width(windowWidth)
            .fillMaxHeight()
            .background(MaterialTheme.colorScheme.background),
        topBar = {
            Box {
                MyTopBar(title = {
                    MyText(text = "新增关系")
                },
                    windowInsets = WindowInsets(
                        0,
                        0,
                        0,
                        0
                    ),
                    actions = {},
                    navigationIcon = {
                        MyNavigationIcon(onClick = dismiss)
                    })

                MyNotify(
                    show = notifyShow,
                    content = notifyContent
                )
            }
        },
        topBarDivider = {
            MyDivider(myDividerDirection = MyDividerDirection.HOR)
        },
        content = {
            var scope = rememberCoroutineScope()
            var relationName = addRelationTextFieldState.textFieldValue.collectAsState()
            var relationNameError = addRelationTextFieldState.isError.collectAsState()
            Column {
                MySpacer(modifier = Modifier.height(smallSpacer))
                MySpacer(modifier = Modifier.height(smallSpacer))
                MyListItem(tonalElevation = 0.dp,
                    shadowElevation = 0.dp,
                    colors = ListItemDefaults.colors(containerColor = MaterialTheme.colorScheme.background),
                    headlineContent = {
                        MyTextField(
                            myTextFieldState = addRelationTextFieldState,
                            leadingIcon = {
                                MyIcon(imageVector = Icons.Rounded.ManageAccounts)
                            },
                            placeholder = {
                                MyText(text = "请输入关系人名称")
                            },
                            value = relationName.value,
                            onValueChange = {
                                addRelationTextFieldState.flowUpdate_textFieldValue(it)
                            },
                            label = {
                                MyText(text = "关系人名称")
                            },
                            isError = relationNameError.value
                        )
                    })
                MySpacer(modifier = Modifier.height(smallSpacer))
                MyListItem(tonalElevation = 0.dp,
                    shadowElevation = 0.dp,
                    colors = ListItemDefaults.colors(containerColor = MaterialTheme.colorScheme.background),
                    headlineContent = {
                        MyFilledTonalButton(enabled = !relationName.value.text.isEmpty(),
                            colors = ButtonColors(
                                containerColor = MaterialTheme.colorScheme.surfaceTint,
                                contentColor = MaterialTheme.colorScheme.onPrimary,
                                disabledContainerColor = ButtonDefaults.buttonColors().disabledContainerColor,
                                disabledContentColor = ButtonDefaults.buttonColors().disabledContentColor
                            ),
                            modifier = Modifier.fillMaxWidth(),
                            onClick = {
                                scope.launch {
                                    var result =
                                        addNewViewModel.request_addAccountRelationPeople(relationName.value.text)
                                            .await()
                                    if (result.code < 1) {
                                        notifyContent.value = "新增成功"
                                        notifyShow.value = true
                                        addRelationTextFieldState.flowUpdate_textFieldValue(TextFieldValue(""))
                                        addNewViewModel.updateAccountRelationPeopleList()
                                    }
                                }
                            }) {
                            MyText(
                                text = "保存",
                                fontWeight = FontWeight.W500
                            )
                        }
                    })
            }
        })
}